<template>
	<view class="container">
		<view class="flex_start nav_box">
			<view :class="active < 1 ? 'nav_item nav_item_act':'nav_item'" @click="navTab(0)">全部</view>
			<view :class="active == 1 ? 'nav_item nav_item_act':'nav_item'" @click="navTab(1)">实时用工</view>
		</view>
		<view class="employ_part"  v-for="(item,index) in employList" :key="index">
			<view class="top_part" @click="todetail(item)">
				<view class="left">
					<view class="name" v-if="item.recruit">
						{{item.recruit.title}}
					</view>
					<view class="distance_address" v-if="item.recruit">
						{{item.recruit.city}} &nbsp;&nbsp;{{item.recruit.address}}
					</view>
					<view class="types" v-if="item.recruit">
						<view class="type_item" v-for="(type,i) in item.recruit.positionLabel" :key="i" v-if="i<4">
							{{type}}
						</view>
					</view>
					<view class="company_person">
						<!-- <image :src="item.avatar?  item.avatar:'../../static/img/detailInfo/detailavatar.png'"></image> -->
						<text v-if="item.company">{{item.company.name}} &nbsp;|&nbsp;招聘者</text>
						
					</view>
				</view>
				<view class="right">
					<view class="distance_address" v-if="item.recruit">
						{{item.recruit.address}}
					</view>
					<view class="money" v-if="item.recruit">
						￥{{item.recruit.salary}}
					</view>
					<view class="distance" v-if="item.recruit.joinNum">已有{{item.recruit.joinNum}}人参加</view>
					<view class="go_rob" v-if="item.status == 1">
					     接单中
					</view>
					<view class="go_rob red" v-if="item.status == 2">
					     已报名
					</view>
					<view class="go_rob" v-if="item.status == 3">
					     已确认
					</view>
					<view class="go_rob" v-if="item.status == 4">
					     已报到
					</view>
					<view class="go_rob" v-if="item.status == 5">
					     已完成
					</view>
					<view class="go_rob" v-if="item.status == 6">
					     不合格
					</view>
					<view class="go_rob" v-if="item.status == 7">
					     报名过期
					</view>
					<view class="go_rob" v-if="item.status == 8">
					     已取消
					</view>
				</view>	
			</view>
			<view class="bottom_part">
				<view class="accept_part">
					<image src="../../static/img/accept.png" mode=""></image>
					<view class="" v-if="item.recruit">
						{{item.status>=4?"已报到":"未报到"}}
					</view>
				</view>
				<view class="accept_part" v-if="item.status == 5">
					<image src="../../static/img/comment.png" mode=""></image>
					<view class="">
						<text  @click="comment(item.recruitId,item.company.id)">评价</text>
					</view>
				</view>
				<view v-else class="accept_part">
					<image src="../../static/img/share.png" mode=""></image>
					<view class="">
						<text  @click="show(item.recruit)">分享</text>
					</view>
				</view>
				<view class="accept_part" v-if="item.status < 3">
					<image src="../../static/img/down.png" mode=""></image>
					<view class="">
						<text  @click="cancel(item)">取消报名</text>
					</view>
				</view>
				<!-- 删除订单 -->
				<view class="del" @click="delect(item)">
					<image src="../../static/img/rubbish.png" mode=""></image>
				</view>
			</view>
		</view>
		<uni-popup ref="popup" type="bottom">
			<view class="pop">
				<view class="">
					<image src="../../static/img/login/weixin.png" mode="" @click="friendshare()"></image>
					<text>分享好友</text>
				</view>
				<view class="">
					<image src="../../static/img/login/weixin.png" mode="" @click="shareFriendcricle()"></image>
					<text>分享朋友圈</text>
				</view>
			</view>
		</uni-popup>
		<view class="reach_bottom">
			~暂无更多内容~
		</view>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	export default {
		data() {
			return {
				shareobj: {},
				active: 0,
				employList: [
				],
				form:{
					status:99,
					page:1,
					pageSize:99
				}	
			}
		},
		components:{
			uniPopup,
		},
		mounted() {
			this.myRecruitJoinList()
		},
		methods: {
			todetail(item){
				console.log(item)
				switch (this.active){
					case 0:
						if (Number(item.recruit.group) > 0) { //普通详情
							uni.navigateTo({
								url:'/pages/groupBuy/groupBuy?type=public&id='+item.recruit.id
							})
						} else { //普通删除
							uni.navigateTo({
								url:'/pages/jobDetail/jobDetail?type=public&id='+item.recruit.id
							})
						}
						break;
					case 1:
						if (Number(item.recruit.group) > 0) { //普通详情
							uni.navigateTo({
								url:'/pages/groupBuy/groupBuy?type=realtime&id='+item.timeOrder.id
							})
						} else { //普通删除
							uni.navigateTo({
								url:'/pages/jobDetail/jobDetail?type=realtime&id='+item.timeOrder.id
							})
						}
						break;
					default:
						break;
				}
			},
			navTab(index) {
				this.active = index
				switch (this.active){
					case 0:
						this.myRecruitJoinList()
						break;
					case 1:
						this.myTimeOrderAcceptList()
						break;
					default:
						break;
				}
			},
			cancel(item){ //取消报名
				switch (this.active){
					case 0:
						if (Number(item.recruit.group) > 0) { //取消组队
							this.$utils.requert({url:'recruitGroupCancel',data:{groupId:item.groupId}}).then(res=>{
								if(res.code === 1 ){
									this.$utils.showLayer(res.message)
									this.myRecruitJoinList()
								}else{    
									this.$utils.showLayer(res.message)
								}
							})
						} else { //普通取消报名
							this.$utils.requert({url:'recruitJoinCancel',data:{orderId:item.id}}).then(res=>{
								if(res.code === 1 ){
									this.$utils.showLayer(res.message)
									this.myRecruitJoinList()
								}else{    
									this.$utils.showLayer(res.message)
								}
							})
						}
						break;
					case 1:
						if (Number(item.recruit.group) > 0) { //取消组队
							this.$utils.requert({url:'timeOrderGroupCancel',data:{groupId:item.groupId}}).then(res=>{
								if(res.code === 1 ){
									this.$utils.showLayer(res.message)
									this.myTimeOrderAcceptList()
								}else{    
									this.$utils.showLayer(res.message)
								}
							})
						} else { //普通取消报名
							this.$utils.requert({url:'userTimeOrderCancel',data:{orderId:item.id}}).then(res=>{
								if(res.code === 1 ){
									this.$utils.showLayer(res.message)
									this.myTimeOrderAcceptList()
								}else{    
									this.$utils.showLayer(res.message)
								}
							})
						}
						break;
					default:
						break;
				}
			},
			//我的报名
			myRecruitJoinList(){
				this.$utils.requert({url:'myRecruitJoinList',data:this.form,type:'post'}).then(res=>{
					if(res.code === 1 ){
						// this.$utils.showLayer(res.message)
						this.employList = res.data.data
						
					}else{    
						this.$utils.showLayer(res.message)
					}
				})
			},
			//我的实时用工报名
			myTimeOrderAcceptList(){
				this.$utils.requert({url:'myTimeOrderAccept',data:this.form,type:'post'}).then(res=>{
					if(res.code === 1 ){
						// this.$utils.showLayer(res.message)
						let datas = res.data.data
						datas.forEach((e)=>{
							e.recruit = e.timeOrder
						})
						this.employList = datas
						
					}else{    
						this.$utils.showLayer(res.message)
					}
				})
			},
			delect(item){//删除报名信息
				switch (this.active){
					case 0:
						if (Number(item.recruit.group) > 0) { //删除组队
							this.$utils.requert({url:'recruitGroupDelete',data:{groupId:item.groupId}}).then(res=>{
								if(res.code === 1 ){
									this.$utils.showLayer(res.message)
									this.myRecruitJoinList()
								}else{    
									this.$utils.showLayer(res.message)
								}
							})
						} else { //普通删除
							this.$utils.requert({url:'recruitJoinDelete',data:{orderId:item.id}}).then(res=>{
								if(res.code === 1 ){
									this.$utils.showLayer(res.message)
									this.myRecruitJoinList()
								}else{    
									this.$utils.showLayer(res.message)
								}
							})
						}
						break;
					case 1:
						this.$utils.requert({url:'userTimeOrderDelete',data:{orderId:item.id}}).then(res=>{
							if(res.code === 1 ){
								this.$utils.showLayer(res.message)
								this.myTimeOrderAcceptList()
							}else{    
								this.$utils.showLayer(res.message)
							}
						})
						break;
					default:
						break;
				}
				switch (this.active){
					case 0:
						this.$utils.requert({url:'recruitGroupDelete',data:{groupId:id},type:'post'}).then(res=>{
							if(res.code === 1 ){
								this.$utils.showLayer(res.message)
								this.myRecruitJoinList()
							}else{    
								this.$utils.showLayer(res.message)
							}
						})
						break;
					case 1:
						this.$utils.requert({url:'userTimeOrderDelete',data:{orderId:id},type:'post'}).then(res=>{
							if(res.code === 1 ){
								this.$utils.showLayer(res.message)
								this.myTimeOrderAcceptList()
							}else{    
								this.$utils.showLayer(res.message)
							}
						})
						break;
					default:
						break;
				}
			},
			//公司评价
			comment(id,cid){
				uni.navigateTo({
					url:"/pages/issue/issue?id=" + id +"&cid=" + cid
				})
			},
			show(item){
				this.shareobj = item
				console.log(this.shareobj)
				this.$refs.popup.open()
			},
			friendshare(){
				 uni.share({ 
					provider: "weixin",
					scene: "WXSceneSession",
					type: 0,
					href: "http://d.7short.com/su6g",//这地址太长了，就省略了
					title: this.shareobj.publishType,
					summary: this.shareobj.title + '￥'+this.shareobj.salary,                         
					imageUrl: "http:*******************",
					success: function(res) {
							console.log("success:" + JSON.stringify(res));
					},
					fail: function(err) {
							console.log("fail:" + JSON.stringify(err));
					}
				});
			},
			//朋友圈
			shareFriendcricle() {
				uni.share({
						provider: "weixin",
						scene: "WXSenceTimeline",
						type: 0,
						href: "http://d.7short.com/su6g",
						title: this.shareobj.publishType,
						summary: this.shareobj.title + '￥'+this.shareobj.salary,   
						imageUrl: "http:*******************",
						success: function(res) {
								console.log("success:" + JSON.stringify(res));
						},
						fail: function(err) {
								console.log("fail:" + JSON.stringify(err));
						}
					});
				}
			}
		}
</script>
<style>
	page {
		width: 100%;
		height: 100%;
		background-color: #fff;
	}
</style>

<style scoped>
	.nav_box{
		width: 100%;
		font-size: 30rpx;
		height: 88rpx;
		background: white;
		z-index: 9;
		font-weight: 100;
	}
	.nav_item{
		margin-right: 30rpx;
	}
	.nav_item_act{
		color: #FCA601;
	}
	.container {
		width: 100%;
		height: 100%;
		padding:0 23rpx 38rpx;
		box-sizing: border-box;
	}
	.employ_part{
		padding:40rpx 8rpx;
		border:1rpx solid #F6F6F6;
		margin-bottom: 30rpx;
		border-radius: 7rpx;
	}
	.top_part{
		display: flex;
		justify-content: space-between;
		position: relative;
		margin-bottom: 30rpx;
	}
	.employ_part .name{
		font-size: 31rpx;
		color:#323232;
	}
	 .distance_address{
		font-size: 24rpx;
		color: #838282;
	}
	.employ_part .types{
		display: flex;
		margin-bottom: 30rpx;
		margin-top: 30rpx;
	}
	.employ_part .types .type_item{
		padding:0 8rpx;
		border:1rpx solid #f6f6f6;
		font-size: 25rpx;
		color: #FB8408;
		margin-right: 16rpx;
	}
	.employ_part .types .type_item:nth-child(2){
		color: #3185ed;
	}
	.employ_part .types .type_item:nth-child(3){
		color: #fd4f44;
	}
	.company_person{
		font-size: 24rpx;
		color: #333333;
		display: flex;
		align-items: center;
	}
	.company_person image{
		width:42rpx;
		height: 42rpx;
		margin-right: 17rpx;
	}
	.right{
	 text-align: right;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-end;
	}
	.right .money{
		font-size: 28rpx;
		color:#FB8408;
	}
	.go_rob{
		width: 137rpx;
		height: 54rpx;
		line-height: 54rpx;
		text-align: center;
		color:#Fff;
		background-color: #FFA008;
		font-size: 28rpx;
		border-radius: 7rpx;
		margin: 0;
		margin-top: 15rpx;
	}
	.red{
		background-color: #FA4600;
	}
	
	.bottom_part{
		display: flex;
		align-items: center;
		border-top:1rpx solid #f6f6f6;
		padding:30rpx 20rpx 0;
		box-sizing: border-box;
		font-size: 28rpx;
		color: #C9C6C6;
	}
	.bottom_part .del{
		margin-left: auto;
	}
	.bottom_part .accept_part{
		display: flex;
		align-items: center;
		margin-right: 40rpx;
	}
	.bottom_part  image{
		width: 30rpx;
		height: 30rpx;
	}
	.bottom_part  image:nth-child(1){
		margin-right: 20rpx;
	}
	.reach_bottom{
		margin-top:35rpx;
		text-align: center;
		font-size: 28rpx;
		color: #D5D1D1;
	}
	.share{
		display: block;
		font-size: #7a7a7a;
		margin-top: auto;
		font-size: 24rpx;
		margin-right: 200rpx;
		background-color: #FFA008;
		color: #fff;
		padding: 5rpx 15rpx;
		border-radius: 10rpx;
	}
	.pop{
		display: flex;
		background-color: #fff;
	}
	.pop view {
		display: flex;
		flex-direction: column;
		align-items: center;
		height: 200rpx;
		justify-content: center;
		font-size: 28rpx;
		width: 100%;
	}
	.pop view image{
		width: 100rpx;
		height: 100rpx;
	}
	.pop view text {
		margin-top: 10rpx;
	}
</style>
